<template>
  <view class="user-info">
    <nav-bar title="商家信息" color="white" show-back bgColor="black"></nav-bar>
    <view class="content">
      <view class="base-info">
        <view class="bus-name flex justify-between">
          <text class="block" @click="debug"> {{ info.businessName }}</text>
          <!-- <view><u-button type="error" @click="loginoutClick">退出登录</u-button></view> -->
        </view>
        <u-row gutter="10rpx">
          <u-col span="3">
            <text>商家性质：{{ info.merchantNature }}</text>
          </u-col>
          <u-col span="3">
            <text>合作模式：{{ cooperationMode[info.usageMode] || "-" }}</text>
          </u-col>
          <u-col span="3">
            <text>VA卡：{{ info.vaCard || "-" }}</text>
          </u-col>
          <u-col span="3">
            <text>设备号：{{ deviceId || "-" }}</text>
          </u-col>
        </u-row>
      </view>

      <!-- 责任信息 -->
      <view class="respon-info">
        <u-row gutter="10rpx">
          <u-col span="3" align="left">
            <text class="info-text">主要负责人：{{ info.leadingCadre }}</text>
          </u-col>
          <u-col span="3" align="left">
            <text>联系方式：{{ info.leadingCadrePhone || "-" }}</text>
          </u-col>
          <u-col span="6">
            <text>证件号：{{ info.businessIdNumber || "-" }}</text>
          </u-col>
        </u-row>
        <u-row gutter="10rpx" customStyle="margin-top:15rpx;">
          <u-col span="3">
            <text>法人：{{ info.legalPerson || "-" }}</text>
          </u-col>
          <u-col span="9">
            <text>营业地址：{{ info.address || "-" }}</text>
          </u-col>
        </u-row>
      </view>

      <!-- 服务信息 -->
      <view class="server-info">
        <u-row gutter="10rpx">
          <u-col span="3" align="left">
            <text class="info-text">服务状态：{{ serviceStatus[info.serviceStatus] || "-" }}</text>
          </u-col>
          <u-col span="3" align="left">
            <text>营业时间：{{ `${info.startBusinessHours || "--"} ~ ${info.endBusinessHours || "--"}` }}</text>
          </u-col>
          <u-col span="3">
            <text>周末服务：{{ isYesOrNo(info.openWeekends) }}</text>
          </u-col>
          <u-col span="3">
            <text>假日服务：{{ isYesOrNo(info.openHoliday) }}</text>
          </u-col>
        </u-row>
        <u-row gutter="10rpx" customStyle="margin-top:15rpx;">
          <u-col span="3">
            <text>服务区域：{{ info.serviceArea || "-" }}</text>
          </u-col>
          <u-col span="3">
            <text>所属区域：{{ info.regionName || "-" }}</text>
          </u-col>
          <u-col span="6">
            <text>地址：{{ info.address || "-" }}</text>
          </u-col>
        </u-row>
      </view>
    </view>
  </view>
</template>
<script setup>
import { getAndroidId, getDeviceSerialNumber } from "@/utils/util";
import { computed, onMounted, reactive, ref } from "vue";
import { useStore } from "vuex";

const store = useStore();
const info = reactive(store.getters.businessInfo);
console.log(info);

// cooperationMode	合作模式{ 资金专户模式 regulatory /  快速清分模式 fastSettle / 自动分账模式 automatic} @sys_usageMode_jj
const cooperationMode = {
  regulatory: "资金专户模式",
  fastSettle: "快速清分模式",
  automatic: "自动分账模式",
};

// serviceStatus	服务状态（1正常2停止、禁用）
const serviceStatus = {
  1: "正常",
  2: "停止",
};

// 是否
const isYesOrNo = (val) => {
  return val == 1 ? "是" : "否";
};

// 打开调试页面
const debugCount = ref(0);
const debug = () => {
  if (!debugCount.value) debugCount.value = 0;
  debugCount.value++;
  if (debugCount.value < 5) return;
  uni.navigateTo({
    url: `/pages/subSetting/debug/debug`,
  });
};

const deviceId = ref("");

onMounted(async () => {
  deviceId.value = await getDeviceSerialNumber();
});
</script>
<style lang="scss" scoped>
.content {
  height: 100%;
}

.user-info {
  background-color: white;
  height: inherit;
  box-sizing: border-box;
  font-size: 10rpx;

  .base-info {
    margin: 20rpx;
    background-color: #f5faff;
    padding: 20rpx;
    border-radius: 5rpx;
    font-weight: bolder;

    .bus-name {
      font-size: 15rpx;
      margin-bottom: 20rpx;
    }
  }

  .respon-info,
  .server-info {
    margin: 20rpx;
    padding: 20rpx;
    font-size: 10rpx;
    // font-weight: bold;

    .info-text {
      display: block;
      white-space: nowrap;
      overflow: scroll;
    }
  }
}

.btns-item {
  background-color: #efefef;
  padding: 5rpx 20rpx;
  border-radius: 5rpx;
  margin: 0rpx 15rpx;
  font-size: 12rpx;
  &.confirm {
    color: white;
    background-color: red;
  }

  .btns-item-txt {
    font-size: 10rpx;
    padding: 5rpx 15rpx;
  }

  ::v-deep .u-button {
    padding: 2rpx 20rpx;
  }
}
</style>
